<template>
  <component :is="getComponentName(value.field)" :detail="results" v-loading="loading" />
  <div class="paginaTion" v-if="total > 10">
    <Pagination
      v-model:limit="pageSize"
      v-model:page="pageNo"
      :total="total"
      @pagination="getTableData"
    />
  </div>
</template>
<script setup lang="ts">
import TenderBidding from './components/tender_bidding.vue'
import { nodePageGet } from '@/api/ent/advanceSearch/index'
const props = defineProps({
  value: Object,
  cid: String
})
const loading = ref(false)
const pageNo = ref(1)
const pageSize = ref(10)
const total = ref(0)
const results = ref(null)
onMounted(() => {
  watchEffect(() => {
    if (Object.keys(props.value).length) {
      const value = JSON.parse(JSON.stringify(props.value))
      pageNo.value = value.pageNo
      pageSize.value = value.pageSize
      total.value = value.total
      results.value = value.results
    }
  })
})
const getComponentName = (field) => {
  // 招标投标
  if (field === 'tenderBiddingCount') {
    return TenderBidding
  }
}
const getTableData = async (val) => {
  let params = {
    pageNo: val.page,
    pageSize: val.limit,
    cid: props.cid,
    nodes: [props.value.field]
  }
  loading.value = true
  const res = await nodePageGet({ ...params })
  pageNo.value = res[props.value.field].pageNo
  pageSize.value = res[props.value.field].pageSize
  total.value = res[props.value.field].total
  results.value = res[props.value.field].results
  loading.value = false
}
</script>
<style lang="scss" scoped>
.paginaTion {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 20px 10px 0;
}
</style>
